<template>
  <a-card :bordered="false">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <a-col :xl="5" :lg="7" :md="8" :sm="24">
            <a-form-item label="ID">
              <a-input placeholder="请输入用户ID" v-model="queryParam.id"></a-input>
            </a-form-item>
          </a-col>
          <a-col :xl="5" :lg="7" :md="8" :sm="24">
            <a-form-item label="推荐人ID">
              <a-input placeholder="请输入推荐人ID" v-model="queryParam.parentId"></a-input>
            </a-form-item>
          </a-col>
          <a-col :xl="5" :lg="7" :md="8" :sm="24">
            <a-form-item label="昵称">
              <a-input placeholder="请输入昵称" v-model="queryParam.nickname"></a-input>
            </a-form-item>
          </a-col>
          <a-col :xl="5" :lg="7" :md="8" :sm="24">
            <a-form-item label="性别">
              <j-dict-select-tag placeholder="请选择性别" v-model="queryParam.sex" dictCode="sex"/>
            </a-form-item>
          </a-col>
          <a-col :xl="5" :lg="7" :md="8" :sm="24">
            <a-form-item label="会员等级">
              <j-dict-select-tag placeholder="请选择会员等级" v-model="queryParam.vipLevel" dictCode="dbn_level"/>
            </a-form-item>
          </a-col>

          <template v-if="toggleSearchStatus">
            <a-col :xl="5" :lg="7" :md="8" :sm="24">
              <a-form-item label="账号状态">
                <j-dict-select-tag placeholder="请选择账号状态" v-model="queryParam.status" dictCode="app_user_status"/>
              </a-form-item>
            </a-col>
            <a-col :xl="5" :lg="7" :md="8" :sm="24">
              <a-form-item label="手机号码">
                <a-input placeholder="请输入手机号码" v-model="queryParam.phone"></a-input>
              </a-form-item>
            </a-col>
            <a-col :xl="10" :lg="11" :md="12" :sm="24">
              <a-form-item label="注册时间">
                <j-date :show-time="true" date-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择开始时间" class="query-group-cust" v-model="queryParam.createTime_begin"></j-date>
                <span class="query-group-split-cust"></span>
                <j-date :show-time="true" date-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择结束时间" class="query-group-cust" v-model="queryParam.createTime_end"></j-date>
              </a-form-item>
            </a-col>
          </template>
          <a-col :xl="3" :lg="7" :md="8" :sm="24">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
              <a @click="handleToggleSearch" style="margin-left: 8px">
                {{ toggleSearchStatus ? '收起' : '展开' }}
                <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
              </a>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->

    <!-- 操作按钮区域 -->
    <div class="table-operator">
      <a-button @click="handleAdd" type="primary" icon="plus">添加用户</a-button>
    </div>

    <!-- table区域-begin -->
    <div>
      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
        <a style="margin-left: 24px" @click="onClearSelected">清空</a>
      </div>

      <a-table
        ref="table"
        size="middle"
        :scroll="{x:true}"
        bordered
        rowKey="id"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
        class="j-table-force-nowrap"
        @change="handleTableChange">

        <template slot="statusSlot" slot-scope="text, record">
          <div v-if="record.userStatus === '0'" style="color: #000000">{{text}}</div>
          <div v-else style="color: red">{{text}}</div>
        </template>
        <template slot="parentNameSlot" slot-scope="text,record">
          <span v-if="record.parentId">
            <div>昵称：{{text}}</div>
            <div>ID: {{record.parentId}}</div>
          </span>
        </template>
        <template slot="imgSlot" slot-scope="text,record">
          <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
          <img v-else :src="getImgView(text)" :preview="record.id" height="30px" alt="" style="max-width:80px;font-size: 12px;font-style: italic;"/>
        </template>

        <!-- 账号状态(0-正常 1-禁言中 2-封号中 3-已注销 4-禁止提现) -->
        <span slot="action" slot-scope="text, record">
          <a @click="openBanaccountModal(record)" v-if="record.userStatus === '0' || record.userStatus === '1' || record.userStatus === '4'">封号</a>
          <a-divider type="vertical" v-if="record.userStatus === '0' || record.userStatus === '1' || record.userStatus === '4'"/>
          <a @click="bianImMsg(record)" v-if="record.userStatus != '1'">禁言</a>
          <a-divider type="vertical" v-if="record.userStatus != '1'"/>
          <a @click="unseal(record.id)" v-if="record.userStatus === '2'">解封</a>
          <a-divider type="vertical" v-if="record.userStatus === '2'"/>
          <a @click="removeBanIm(record.id)" v-if="record.userStatus === '1' || record.userStatus === '4'">解除禁言</a>
          <a-divider type="vertical" v-if="record.userStatus == '1' || record.userStatus === '4'"/>
          <a @click="openEdit(record)">修改</a>
          <a-divider type="vertical" />
          <a-dropdown>
            <a class="ant-dropdown-link">更多 <a-icon type="down" /></a>
            <a-menu slot="overlay">
              <a-menu-item>
                <a @click="openEditUserInfo(record)">修改个人资料</a>
              </a-menu-item>
              <a-menu-item>
                <a @click="openUpdateParentUser(record)">推广绑定</a>
              </a-menu-item>
              <a-menu-item>
                <a-popconfirm title="确定设为离线吗?" @confirm="() => offLineUser(record.id)">
                  <a>设为离线</a>
                </a-popconfirm>
              </a-menu-item>
              <a-menu-item v-if="record.userStatus === '3'">
                <a-popconfirm title="确定快速注销吗?" @confirm="() => quickLogout(record.id)">
                  <a>快速注销</a>
                </a-popconfirm>
              </a-menu-item>
              <a-menu-item>
                <a @click="openUserSell(record)">设置推荐</a>
              </a-menu-item>
              <a-menu-item>
                <a @click="openDiamondList(record)">收益明细</a>
              </a-menu-item>
              <a-menu-item>
                <a @click="openGoldList(record)">充值明细</a>
              </a-menu-item>
              <a-menu-item>
                <a @click="webAddGoldNum(record)">充值金币</a>
              </a-menu-item>
              <a-menu-item>
                <a @click="webCutGoldNum(record)">扣减金币</a>
              </a-menu-item>
              <a-menu-item>
                <a @click="webAddIntegralNum(record)">充值积分</a>
              </a-menu-item>
              <a-menu-item>
                <a @click="webCutIntegralNum(record)">扣减积分</a>
              </a-menu-item>
              <a-menu-item>
                <a @click="sendSystemMessage(record)">消息推送</a>
              </a-menu-item>
              <a-menu-item>
                <a @click="openCommunityInfoList(record)">动态列表</a>
              </a-menu-item>
              <a-menu-item>
                <a @click="openUpdateUserDbnLevel(record)">分销等级修改</a>
              </a-menu-item>
              <a-menu-item>
                <a-popconfirm title="是否确定真人认证通过?" @confirm="() => webAuthReal(record.id)">
                  <a>真人认证通过</a>
                </a-popconfirm>
              </a-menu-item>
              <a-menu-item>
                <a-popconfirm title="确定强制注销吗?" @confirm="() => webOffUser(record.id)">
                  <a>强制注销</a>
                </a-popconfirm>
              </a-menu-item>
              <a-menu-item v-has="'user:addDiamond'">
                <a @click="webAddDiamondNum(record)" >钻石充值</a>
              </a-menu-item>
              <a-menu-item v-has="'user:cutDiamond'">
                <a @click="webCutDiamondNum(record)">钻石扣减</a>
              </a-menu-item>
              <a-menu-item v-has="'user:setUserRatio'">
                <a @click="setUserRatio(record)">设置分成比例</a>
              </a-menu-item>
            </a-menu>
          </a-dropdown>
        </span>

      </a-table>
    </div>

    <app-user-modal ref="modalForm" @ok="modalFormOk"></app-user-modal>
    <BanaccountModal ref="BanaccountModal" @ok="modalFormOk"></BanaccountModal>
    <UpdateUserSexPhone ref="UpdateUserSexPhone" @ok="modalFormOk"></UpdateUserSexPhone>
    <UpdateUserInfo ref="UpdateUserInfo" @ok="modalFormOk"></UpdateUserInfo>
    <UpdateParentUser ref="UpdateParentUser" @ok="modalFormOk"></UpdateParentUser>
    <UpdateUseraSell ref="UpdateUseraSell" @ok="modalFormOk"></UpdateUseraSell>
    <DiamondDetailList ref="DiamondDetailList" @ok="modalFormOk"></DiamondDetailList>
    <GoldDetailList ref="GoldDetailList" @ok="modalFormOk"></GoldDetailList>
    <AddUserGoldNum ref="AddUserGoldNum" @ok="modalFormOk"></AddUserGoldNum>
    <AddUserIntegralNum ref="AddUserIntegralNum" @ok="modalFormOk"></AddUserIntegralNum>
    <AddSystemMessage ref="AddSystemMessage"></AddSystemMessage>
    <UpdateUserDbnLevel ref="UpdateUserDbnLevel" @ok="modalFormOk"></UpdateUserDbnLevel>
    <CommunityInfoList ref="CommunityInfoList"></CommunityInfoList>
    <CutUserGoldNum ref="CutUserGoldNum" @ok="modalFormOk"></CutUserGoldNum>
    <CutUserIntegralNum ref="CutUserIntegralNum" @ok="modalFormOk"></CutUserIntegralNum>
    <AddUserDiamondNum ref="AddUserDiamondNum" @ok="modalFormOk"></AddUserDiamondNum>
    <CutUserDiamondNum ref="CutUserDiamondNum" @ok="modalFormOk"></CutUserDiamondNum>
    <SettingsUserRadio ref="SettingsUserRadio" @ok="modalFormOk"></SettingsUserRadio>
  </a-card>
</template>

<script>

  import '@/assets/less/TableExpand.less'
  import { mixinDevice } from '@/utils/mixin'
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import AppUserModal from './modules/AppUserModal'
  import { getAction } from '@/api/manage'
  import BanaccountModal from '@/views/xiny/security/banaccount/modules/BanaccountModal'
  import UpdateUserSexPhone from './modules/UpdateUserSexPhone'
  import UpdateUserInfo from './modules/UpdateUserInfo'
  import UpdateParentUser from './modules/UpdateParentUser'
  import UpdateUseraSell from './modules/UpdateUseraSell'
  import DiamondDetailList from './modules/DiamondDetailList'
  import GoldDetailList from './modules/GoldDetailList'
  import AddUserGoldNum from './modules/AddUserGoldNum'
  import AddUserIntegralNum from './modules/AddUserIntegralNum'
  import AddSystemMessage from './modules/AddSystemMessage'
  import UpdateUserDbnLevel from './modules/UpdateUserDbnLevel'
  import CommunityInfoList from './modules/CommunityInfoList'
  import CutUserGoldNum from './modules/CutUserGoldNum'
  import CutUserIntegralNum from './modules/CutUserIntegralNum'
  import AddUserDiamondNum from './modules/AddUserDiamondNum'
  import CutUserDiamondNum from './modules/CutUserDiamondNum'
  import SettingsUserRadio from './modules/SettingsUserRadio'

  export default {
    name: 'AppUserList',
    mixins:[JeecgListMixin, mixinDevice],
    components: {
      AppUserModal,
      BanaccountModal,
      UpdateUserSexPhone,
      UpdateUserInfo,
      UpdateParentUser,
      UpdateUseraSell,
      DiamondDetailList,
      GoldDetailList,
      AddUserGoldNum,
      AddUserIntegralNum,
      AddSystemMessage,
      UpdateUserDbnLevel,
      CommunityInfoList,
      CutUserGoldNum,
      CutUserIntegralNum,
      AddUserDiamondNum,
      CutUserDiamondNum,
      SettingsUserRadio
    },
    data () {
      return {
        description: 'app端用户表管理页面',
        // 表头
        columns: [
          {
            title: '#',
            dataIndex: '',
            key:'rowIndex',
            width:60,
            align:"center",
            customRender:function (t,r,index) {
              return parseInt(index)+1;
            }
          },
          {
            title:'ID',
            align:"center",
            dataIndex: 'id'
          },
          {
            title:'昵称',
            align:"center",
            dataIndex: 'nickname'
          },
          {
            title:'性别',
            align:"center",
            dataIndex: 'sex_dictText'
          },
          {
            title:'手机号码',
            align:"center",
            dataIndex: 'phone'
          },
          {
            title:'年龄',
            align:"center",
            dataIndex: 'age'
          },
          {
            title:'头像',
            align:"center",
            dataIndex: 'avatar',
            scopedSlots: { customRender: 'imgSlot' }
          },
          {
            title:'分销等级',
            align:"center",
            dataIndex: 'dbnLevel_dictText'
          },
          {
            title:'金币余额',
            align:"center",
            dataIndex: 'goldNum'
          },
          {
            title:'积分余额',
            align:"center",
            dataIndex: 'integralNum'
          },
          {
            title:'钻石余额',
            align:"center",
            dataIndex: 'diamondNum'
          },
          {
            title:'推荐人',
            align:"center",
            dataIndex: 'parentName',
            scopedSlots: { customRender: 'parentNameSlot' }
          },
          {
            title:'在线状态',
            align:"center",
            dataIndex: 'onlineStatus_dictText'
          },
          {
            title:'注册时间',
            align:"center",
            dataIndex: 'createTime'
          },
          {
            title:'账号状态',
            align:"center",
            dataIndex: 'userStatus_dictText',
            scopedSlots: { customRender: 'statusSlot' }
          },
          {
            title:'推荐编号',
            align:"center",
            dataIndex: 'isSell'
          },
          {
            title: '操作',
            dataIndex: 'action',
            align:"center",
            fixed:"right",
            width:260,
            scopedSlots: { customRender: 'action' }
          }
        ],
        url: {
          list: "/user/appUser/list",
        },
        dictOptions:{},
        superFieldList:[],
      }
    },
    created() {
    },
    computed: {
      importExcelUrl: function(){
        return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
      },
    },
    methods: {
      //打开资料修改
      openEditUserInfo(record){
        this.$refs.UpdateUserInfo.open(record.id);
      },

      //打开修改
      openEdit(record){
        var data={};
        data.userId=record.id;
        data.sex=record.sex;
        data.phone=record.phone;
        this.$refs.UpdateUserSexPhone.open(data);
      },

      //打开推广绑定
      openUpdateParentUser(record){
        var data={};
        data.userId=record.id;
        data.parentId=record.parentId;
        this.$refs.UpdateParentUser.open(data);
      },

      //打开设置推荐
      openUserSell(record){
        var data={};
        data.userId=record.id;
        data.userName=record.nickname;
        data.sellNum=record.isSell;
        this.$refs.UpdateUseraSell.open(data);
      },

      //打开收益明细
      openDiamondList(record){
        this.$refs.DiamondDetailList.open(record.id);
      },

      //打开金币明细
      openGoldList(record){
        this.$refs.GoldDetailList.open(record.id);
      },

      //打开金币充值
      webAddGoldNum(record){
        var data={};
        data.userId=record.id;
        this.$refs.AddUserGoldNum.open(data);
      },

      //扣减金币
      webCutGoldNum(record){
        var data={};
        data.userId=record.id;
        if(record.goldNum<=0){
          this.$message.warning("金币余额不足，不能扣减金币");
          return;
        }
        this.$refs.CutUserGoldNum.maxGold=record.goldNum;
        this.$refs.CutUserGoldNum.open(data);
      },

      //打开金钻石充值
      webAddDiamondNum(record){
        var data={};
        data.userId=record.id;
        this.$refs.AddUserDiamondNum.open(data);
      },

      //扣减钻石
      webCutDiamondNum(record){
        var data={};
        data.userId=record.id;
        if(record.diamondNum<=0){
          this.$message.warning("钻石余额不足，不能扣减钻石");
          return;
        }
        this.$refs.CutUserDiamondNum.maxDiamond=record.diamondNum;
        this.$refs.CutUserDiamondNum.open(data);
      },

      //设置比例
      setUserRatio(record){
        var data={};
        data.userId=record.id;
        this.$refs.SettingsUserRadio.open(data);
      },

      //打开积分充值
      webAddIntegralNum(record){
        var data={};
        data.userId=record.id;
        this.$refs.AddUserIntegralNum.open(data);
      },

      //打开积分扣减
      webCutIntegralNum(record){
        var data={};
        if(record.integralNum<=0){
          this.$message.warning("积分余额不足，不能扣减积分");
          return;
        }
        data.userId=record.id;
        this.$refs.CutUserIntegralNum.maxIntegral =record.integralNum;
        this.$refs.CutUserIntegralNum.open(data);
      },

      //打开发送系统消息
      sendSystemMessage(record){
        var data={};
        data.userId=record.id;
        this.$refs.AddSystemMessage.open(data);
      },

      //打开修改用户分销等级
      openUpdateUserDbnLevel(record){
        var data={};
        data.userId=record.id;
        data.dbnLevel=record.dbnLevel;
        this.$refs.UpdateUserDbnLevel.open(data);
      },

      //打开动态列表
      openCommunityInfoList(record){
        var data={};
        data.userId=record.id;
        data.userName=record.nickname;
        this.$refs.CommunityInfoList.open(data);
      },

      //封号
      openBanaccountModal(record){
        var obj={};
        obj.roomMsgId = record.msgId;
        obj.womanName = record.nickname;
        obj.womanId = record.id;
        obj.whatType="5";//5代表用户列表
        obj.type="1";//1代表封号类型

        this.$refs.BanaccountModal.edit(obj);
        this.$refs.BanaccountModal.title = "封号";
        this.$refs.BanaccountModal.disableSubmit = false;
      },

      //禁言
      bianImMsg(record){
        var obj={};
        obj.roomMsgId = record.msgId;
        obj.womanName = record.nickname;
        obj.womanId = record.id;
        obj.whatType="5";//5代表用户列表
        obj.type="2";//2代表禁言类型

        this.$refs.BanaccountModal.edit(obj);
        this.$refs.BanaccountModal.title = "禁言";
        this.$refs.BanaccountModal.disableSubmit = false;
      },
      //解除封号
      unseal(id){
        this.loading = true
        getAction("/user/banaccount/unsealByUserId", {userId:id}).then(res => {
          if (res.success) {
            this.$message.success(res.message);
            this.loadData();
          } else {
            this.$message.warn(res.message)
          }
        }).finally(() => {
          this.loading = false
        })
      },
      //解除禁言
      removeBanIm(id){
        this.loading = true
        getAction("/user/banaccount/removeBanImByUserId", {userId:id}).then(res => {
          if (res.success) {
            this.loadData();
            this.$message.success(res.message)
          } else {
            this.$message.warn(res.message)
          }
        }).finally(() => {
          this.loading = false
        })
      },

      //快速注销
      quickLogout(id){
        this.loading = true
        getAction("/user/appUser/quickLogout", {userId:id}).then(res => {
          if (res.success) {
            this.loadData();
            this.$message.success(res.message)
          } else {
            this.$message.warn(res.message)
          }
        }).finally(() => {
          this.loading = false
        })
      },

      //真人认证通过
      webAuthReal(id){
        this.loading = true
        getAction("/user/appUser/webAuthReal", {userId:id}).then(res => {
          if (res.success) {
            this.$message.success(res.message)
          } else {
            this.$message.warn(res.message)
          }
        }).finally(() => {
          this.loading = false
        })
      },

      //强制注销
      webOffUser(id){
        this.loading = true
        getAction("/user/appUser/webOffUser", {userId:id}).then(res => {
          if (res.success) {
            this.loadData();
            this.$message.success(res.message)
          } else {
            this.$message.warn(res.message)
          }
        }).finally(() => {
          this.loading = false
        })
      },

      //设为离线
      offLineUser(id){
        this.loading = true
        getAction("/user/appUser/offLineUser", {userId:id}).then(res => {
          if (res.success) {
            this.loadData();
            this.$message.success(res.message)
          } else {
            this.$message.warn(res.message)
          }
        }).finally(() => {
          this.loading = false
        })
      }
    }
  }
</script>
<style scoped>
  @import '~@assets/less/common.less';
</style>